<!--
 * @Author: Aaron
 * @Date: 2022-02-18 10:02:44
 * @LastEditors: YanMeng
 * @LastEditTime: 2022-11-04 17:31:02
 * @Description: file content
 * @FilePath: \ias_ui\src\views\coi\spuChannelInventory\components\JDWalMartChosen.vue
 * @Company: 沃尔玛
-->
<template>
  <div>
    <search-head
      :search-list="searchList"
      :search-data="searchData"
      :options="options"
      @handleSearch="handleSearch"
      @handleReset="() => handleReset({ channelBrandId: '' })"
      @handleDownload="handleDownload('SPU京东沃选商品库')"
      @addition="addition"
    />
    <ess-table
      ref="table"
      :thead-list="JDWalMartChosenList"
      :other-container-box="otherContainerBox"
      :resize-observer-ele="resizeObserverEle"
      :total="total"
      :data-list="dataList"
      :page-params="pageParams"
      row-key="spuCode"
      @handlePageChange="requestData"
      @selectionChange="selectionChange"
      @operationLog="operationLog"
      @handleEdit="handleEdit"
    >
      <el-button-group slot="right">
        <!-- <el-button type="primary" size="mini" :disabled="multipleSelection.length<1" round>商家可售</el-button> -->
        <!-- <el-button type="primary" size="mini" :disabled="multipleSelection.length<1" round>商家不可售</el-button> -->
        <el-button type="primary" size="mini" :disabled="multipleSelection.length < 1" round @click="onCategoryEdit">修改店内类目</el-button>
        <!-- <el-button type="primary" size="mini" :disabled="multipleSelection.length<1" round @click="open('确定发布渠道？', releaseChannelRequest)">发布渠道</el-button> -->
      </el-button-group>

      <template v-slot:productName="{ scope }">
        <span class="el-button--text el-button--mini" @click="goSpuDetails(scope)">{{ scope.row.spuName || scope.row.channelSpuName }}</span>
      </template>

      <template v-slot:img="{ scope }">
        <el-image class="mainImg" :src="scope.row.imageUrl || '' | transImgUrl" :preview-src-list="[scope.row.imageUrl || ''] | transImgUrl" />
      </template>
    </ess-table>
    <purchaseLog v-model="logVisible" width="900px" :title="title" :thead-list="operationLogTableHeaderList" :data-list="operationLogTableList" />
    <modifyCategory
      v-model="categoryVisible"
      :submit-fun="submitFun"
      :channel-id="channelId"
      :id-list="skuCodeList"
      title="修改店内类目"
      @savaSuccess="handleSearch"
    />
    <addSPU ref="addSPURef" :type="type" :menu-name="menuName" />
  </div>
</template>

<script>
import searchHead from '@/components/searchHead/searchHead.vue'
import essTable from '@/components/eTable/eTable.vue'
import { JDChosen } from '../../commonJs/spuWarehouseTableHead'
import { releaseStatus as lastPushResult } from '@/views/coi/commonJs/dictionary.js'
import { tableParams, searchHeaderEvent } from '@/components/eTable/js/mixins.js'
import { checkBoxFun } from '@/views/coi/commonJs/publicMethod.js'
import { requestTableDataFun, getCategoryOptions, getLogs, handleEditMinxin, spuDetail, modifyCategoryFun } from '../js/requestMixins'
import purchaseLog from '@/components/dialogTableInfo/dialogTableInfo.vue'
import modifyCategory from './modifyCategory.vue'
import { authentication } from '@/utils/processingData.js'
import addSPU from '@/views/coi/spuManagement/components/addSPU.vue'
export default {
  name: 'JDWalMartChosen',
  components: {
    searchHead,
    essTable,
    purchaseLog,
    modifyCategory,
    addSPU
  },
  filters: {
    transImgUrl(url) {
      return authentication(url)
    }
  },
  mixins: [tableParams, checkBoxFun, requestTableDataFun, getCategoryOptions, searchHeaderEvent, getLogs, handleEditMinxin, spuDetail, modifyCategoryFun],
  props: {
    menuName: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      channelId: '06',
      searchData: { channelBrandId: '' },
      otherContainerBox: ['.app-container', '.checkComponent', '.tab'],
      resizeObserverEle: ['.app-main', '.app-container'],
      searchList: [
        { label: 'UPC(不含检验码)', type: 'textarea', value: 'skuCodeList' },
        { label: '商品名称', type: 'input', value: 'channelSpuName' },
        { label: '渠道品牌名称', type: 'brandName', value: 'channelBrandId', channelId: '06' },
        { label: '发布状态', type: 'select', value: 'lastPushResult' },
        { label: '渠道平台类目', type: 'cascader', value: 'categoryId' },
        { label: '渠道商品编号', type: 'textarea', value: 'channelSpuIdList' },
        { label: '渠道店铺类目', type: 'cascader', value: 'shopCategoryId' }
      ],
      options: {
        lastPushResult,
        categoryId: [],
        shopCategoryId: []
      },
      type: ''
    }
  },
  computed: {
    JDWalMartChosenList: () => {
      // Todo:当隐藏spu迭代功能的时候编辑按钮不再做控制。反则直接显示不做控制
      const operationParams = window.appConfig.hiddenNewProducts
        ? [{ text: '编辑', on: 'handleEdit', choose: { value: ['createType'], createType: [1] } }]
        : [{ text: '编辑', on: 'handleEdit', choose: { value: ['lastPushResult'], createType: [0], lastPushResult: '推送中', isShowButtonLiu: true } }]
      return JDChosen(operationParams)
    }
  },
  created() {
    this.getChannelTreeList(this.channelId)
    this.getChannelShopTreeList(this.channelId)
  }
}
</script>

<style lang="scss" scoped>
/deep/ .table-header {
  padding-bottom: 10px;
}
</style>
